<ion-header>
  <ion-navbar>
    <ion-title>我的消息</ion-title>
  </ion-navbar>
</ion-header>

<ion-content>
  <div>
    <ion-segment [(ngModel)]="tab">
      <ion-segment-button value="self">
        私信
      </ion-segment-button>
      <ion-segment-button value="comment">
        评论
      </ion-segment-button>
      <ion-segment-button value="@me">
        @我
      </ion-segment-button>
      <ion-segment-button value="notification">
        通知
      </ion-segment-button>
    </ion-segment>
  </div>

  <div [ngSwitch]="tab">
    <ion-list *ngSwitchCase="'self'">
      <ion-item *ngFor="let item of data">
        <ion-avatar item-start>
          <img src="{{item.avatar}}">
        </ion-avatar>
        <h2>{{item.nickname}}</h2>
        <p>This town ain't big enough for the two of us!</p>
        <ion-note item-end>3:43 pm</ion-note>
      </ion-item>
    </ion-list>

    <ion-list *ngSwitchCase="'comment'">
      <ion-item>
        评论
      </ion-item>
    </ion-list>
    <ion-list *ngSwitchCase="'@me'">
      <ion-item>
        @我
      </ion-item>
    </ion-list>
    <ion-list *ngSwitchCase="'notification'">
      <ion-item>
        通知
      </ion-item>
    </ion-list>
  </div>
</ion-content>
